<template>
 <div class="mobileDetail">
  <back-page></back-page>
  <div v-infinite-scroll="getList" class="scrollBox">
    <van-swipe-cell v-for="(item,index) in tableData" :key="index" class="processInfo"  @click="viewData(item)">
       <div class="des">
          <div class="infotitle">{{item.taskName}}</div>
          <div class="infodash" style="margin:10px 0;">
              <span class="infoleft">查阅节点：</span>
              {{item.taskName}}</div>
          <div class="infodash">
              <span class="infoleft">抄送时间：</span>
              {{parseTime(item.createTime)}}
          </div>
       </div>
        <template #right>
            <van-button square text="删除" type="danger" class="delete-button" @click="delData(item,index)"/>
        </template>
    </van-swipe-cell>
  </div>
 </div>
</template>
<script>
import { getCarbonList, checkCarbonList, delMultiCarbonList, delCarbonList} from '@/api/custom/message'
export default {
    props:['titleDetalles','editor','timeDetalles','contentDetalles'],
  data() {
    return {
      tableData: [],
      page: {
            pageNo: 0, // 当前页数
            pageSize: 10, // 每页显示多少条
        },
    };
  },
  created(){
    this.getList();
  },
  methods:{
      getList() {
            this.page.pageNo++;
            let params = {
                ...this.page,
            };
            getCarbonList(params)
            .then((res) => {
                if (res.code === 0) {
                    this.tableData.push(...res.data.list);
                }
            })
            .catch((e) => {
            });
        },
      delData(row,index) {
          let ids = []
          ids.push(row.id)
          const that = this;
          this.$dialog.confirm({
              message: '是否删除该抄送信息！',
            })
              .then(() => {
                  delCarbonList(row.id).then(response => {
                  that.$toast.success('删除成功');
                  that.tableData.splice(index,1)
                })
              })
              .catch(() => {
              });
      },
    viewData(row) { // 查看  抄送人的流程
        checkCarbonList(row.id).then((res) => {
            this.$router.push({ path: "/bpm/process-instance/detail", query: { id: row.processInstanceId, details: 'details',tableId:row.formRecordId}});
        })
    }
  }
};
</script>

<style lang="scss" scoped>
.mobileDetail{
        padding:10px;
        font-size: 14px;
        height:100vh;
        background:#f4f4f4;
        
    }
    .scrollBox {
    width: 100%;
    height: 100%;
    overflow: auto;
}
.processInfo{
    min-height:80px;
    border-radius: 6px;
    margin:10px 0px;
    background:white;
    position: relative;
    ::v-deep .van-swipe-cell__wrapper{
      display: flex;
    }
    .des{
      padding: 16px 0 16px 16px;
    }
}
.infotitle{
    font-weight: bold;
}
.processimgbox{
  position:absolute;
  width:60px;
  height:60px;
  right:20px;
  top:50%;
  transform: translateY(-50%);
}
.infodash{
    font-size: 12px;
    color:#ccc;
    word-break: break-all;
    .infoleft{
        color:black;
    }
}
::v-deep .van-swipe-cell__right{
  right: -1px;
}
.van-button--danger{
  display: flex;
    width: 65px;
    height: 100%;
    font-size: 15px;
    line-height: 100%;
    color: #fff;
    align-items: center;
    justify-content: center;
    background-color: #f44;
}
</style>
